table {
  margin: 0; padding: 0;
  border-collapse: collapse;
  width: 100%;
  table-layout: fixed;
  font-size: smaller;
}

table th { 
  border: dotted black; border-width: 0 1px 0 0;
  background-color: #99CC44;
}
table th.lastColumn { border: 0; }

table td { border: dotted silver; border-width: 0 1px 1px 0; }
table td.lastColumn { border-width: 0 0 1px 0; }

table td.text { text-align: left; }
table td.name { font-weight: bold; }

table tbody tr:hover { background-color: #EEE; }
table td.number { text-align: right; }
table td.year { text-align: right; }

#members th.name { color: white; background-color: #669933; }

#leftPane {
  position: absolute; top: 3em; left: 4px; right: 314px; height: 15em;
  padding: 0; 
}

#groups { 
  position: absolute; top: 0; left: 0; width: 50%; height: 11em; 
}
#groupInfo { 
  position: absolute; top: 11em; left: 0; width: 50%; bottom: 0;
  border: 2px solid #669933; background-color: white; 
  overflow: auto;
  margin: 0 4px 0 0; padding: 0;
}
#groupInfo p { 
  font-size: small; padding: 2px; margin: 0;
}
#groupInfo p:first-child:first-line { font-variant: small-caps; }
#members{ 
  position: absolute; top: 0; right: 4px; width: 49%; height: 15em; 
}

/* fixme -- tbody heights need javascript */
#groupTdiv { height: 9.0em; }
#memberTdiv { position: absolute; top: 2em; bottom: 0;}

#groupTdiv , #memberTdiv{
  overflow: auto; overflow-y: scroll; overflow-x: hidden; width: 100%; 
  border: solid #669933; border-width: 2px;
  background-color: white; 
}

#groupThead, #memberThead {
  height: 2em; /* fixme needs js for height */
  overflow: auto; overflow-y: auto; overflow-x: hidden; width: 100%;
  border: solid #669933; border-width: 2px 2px 0 2px;
}

#map {
  background-color: white;
  border: 2px solid #669933;
  position: absolute; top: 18em; right: 314px; bottom: 2px; left: 4px;
  margin: 4px 0 0 0;
}

.meetingList, .groupList {
  overflow:auto;
  height:8em;
  margin: 0 -3px 0 0; 
  padding: 0 0 0 1em;
  border: 1px solid #669933;
}

ul.groupList li {
  font-weight: bold;
  color: blue;
  cursor: pointer;
  padding: 0; margin: 0;
  list-style: none;
}

#groupOrder, #groupFilter {
  font-size: x-small;
}

#groupFilter select { font-size: x-small; }

#groupOrder .current { text-decoration: underline; }

#meetings table th.year { text-align: left; }
#meetings table th.year:before { content: "\0025BC "; }
#meetings table.collapsed th.year:before { content: "\0025B6 "; }
#meetings table.collapsed tr.meeting { display: none; }
#meetings table th.year { 
  border: solid black;
  border-width: 0 0 1px 0;
}
#meetings table tr.meeting th { 
  border: solid silver; 
  border-width: 0 0 1px 0; 
  text-align: left; vertical-align: top;
  background-color: #DDFFAA;
}
#meetings table tr.meeting td { 
  text-align: left; vertical-align: top;
  background-color: white;
}
#meetings .title { font-weight: bold; }
 
#calendar {
  position: absolute; top: 3em; right: 4px; bottom: 2px; width: 304px;
  overflow: auto;
  margin: 0 0 0 8px; 
  border:solid 2px #669933;
}

#about {
  display: none;
  z-index: 100;
  border: 2px solid black;
  position: absolute; top: 18em; right: 314px; bottom: 2px; left: 4px;
  overflow: auto;
  background-color: #DDFFAA; 
}

.jslink { 
  font-weight: bold;
  color: blue;
  cursor: pointer;
}
